<template>
  <div>
    <Table
      :columns="tableColumns"
      :data="data"
      @on-selection-change="getSelect"
      border
      ref="tableRef"
      stripe
    >
      <template slot="action" slot-scope="{ row, index }" v-permission='"default:edit"'>
        <Button
          @click="handleEditClick(row)"
          size="small"
          style="margin-right: 5px"
          type="primary"
        >编辑</Button>
        <Button
          @click="hanldeViewClick(row)"
          size="small"
          style="margin-right: 5px;display: none"
          type="primary"
        >查看</Button>
      </template>
    </Table>

    <div class="page-wrapper clearfix">
      <Page
        :current="page.curPage"
        :total="total"
        @on-change="handlePageChange"
        @on-page-size-change="handlePageSizeChange"
        show-sizer
        show-total
      />
    </div>
  </div>
</template>

<script>
export default {
  props: {
    data: {
      type: Array,
      required: true
    },
    page: {
      type: Object,
      required: true
    },
    total: Number | String
  },
  data () {
    return {
      tableColumns: [
        {
          type: 'selection',
          width: 50,
          align: 'center'
        },
        {
          title: '所属节点',
          key: 'nodeName'
        },
        {
          title: '节点编号',
          key: 'number'
        },
        {
          title: '表名',
          key: 'reportName'
        },
        // {
        //   title: '更新人员',
        //   key: 'updateUser'
        // },
        // {
        //   title: '更新时间',
        //   key: 'updateTime'
        // },
        {
          title: '操作',
          slot: 'action',
          width: 150,
          align: 'center'
        }
      ],
      sonData: {
        outputList: [],
        noLength: true
      }
    };
  },
  methods: {
    resetPage () {
      debugger;
      this.page.curPage = 1;
    },
    getSelect (selectList) {
      this.sonData.outputList = selectList;

      this.$emit('getoutputList', this.sonData);
    },

    handlePageChange (page) {
      this.$emit('page-change', page);
    },
    handlePageSizeChange (pageSize) {
      this.$emit('pagesize-change', pageSize);
    },
    handleEditClick (row) {
      this.$emit('table-edit-click', row);
    },
    hanldeViewClick (row) {
      this.$emit('table-view-click', row);
    },
    handleTip () {
      console.log('object');
    }
  }
};
</script>

<style lang="less" scoped>
.page-wrapper {
  .ivu-page {
    float: right;
    margin: 10px 0;
  }
}
/deep/ .ivu-table-cell.ivu-table-cell-with-selection{
  text-overflow:clip;
}
.my-disabled{
  color: #c5c8ce;
    background-color: #f7f7f7;
    border-color: #dcdee2
}
</style>
